<template>
  <div class="continer">
    <header>
      <SouSuo></SouSuo>
    </header>
    <main>
      <!-- <van-cell /> -->

      <van-back-top right="0px" bottom="150px" offset="800" />

      <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
        <Banner :banner="banner"></Banner>
        <Skill :skill="skill"></Skill>
        <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
          <Goods :proList="goods"></Goods>
        </van-list>
      </van-pull-refresh>
    </main>
  </div>
</template>

<script>
import SouSuo from './components/SouSuo.vue';
import Banner from './components/Banner.vue';
import Skill from './components/Skill.vue';
import Goods from './components/Goods.vue';
import { getBannerList, getSeckillList, getRecommendList } from '@/apis/goods';

export default {
  components: {
    SouSuo,
    Banner,
    Skill,
    Goods,
  },
  data() {
    return {
      banner: [],
      skill: [],
      goods: [],
      loading: false,
      finished: false,
      count: 1,
      refreshing: false
    }
  },
  methods: {
    onLoad() {
      this.loading = true
      setTimeout(() => {
        // console.log(111);
        this.count++;
        getRecommendList({
          count: this.count,
          limitNum: 6
        }).then(res => {
          let shuju = res.data.data
          if (shuju.length > 0) {
            this.goods = this.goods.concat(res.data.data)
          } else {
            finished = true;
          }
        })

        this.loading = false;
      }, 2000)

    },
    onRefresh() {
      // console.log(11);
      this.refreshing = true;
      this.count = parseInt(Math.random() * 20)
      // console.log(this.count);

      setTimeout(() => {
        getRecommendList({
          count: this.count,
          limitNum: 6
        }).then(res => {
          this.goods = res.data.data

        })
        getSeckillList({
          count: this.count,
          limitNum: 12
        }).then(res => {
          this.skill = res.data.data;
        })
        this.finished = false
        this.refreshing = false;
      }, 1000)

    }
  },
  created() {
    getBannerList().then(res => {
      this.banner = res.data.data
    })
    //获取秒杀产品列表的数据
    getSeckillList({
      count: 1,
      limitNum: 12
    }).then(res => {
      this.skill = res.data.data;
      // console.log(res.data.data);
    })
    getRecommendList({
      count: 1,
      limitNum: 12
    }).then(res => {
      console.log(res.data.data);
      this.goods = res.data.data
    })
  }
}
</script>

<style lang="less" scoped></style>